<template>
    <!-- <h1>hello world</h1>
    <h2>{{ name }}</h2> -->

    firstName: <input type="text" v-model="firstName">
    lastName: <input type="text" v-model="lastName">
</template>

<script setup lang="js" name="test">
import { computed, ref } from 'vue';

// import { defineProps, useAttrs, defineSlots } from 'vue';
// const prop = defineProps(["name"]);
// console.log(prop.name);

// const attrs = useAttrs();
// console.log(attrs);

// const slot = defineSlots();
// console.log(slot);

// let name = ref("zhangsan");
// console.log(name.value);


let firstName = ref('');
let lastName = ref('');

console.log(firstName.value, lastName.value);

// let fullName = computed(() => {
//     return firstName.value + "--" + lastName.value
// })

let fullName = computed({
    get() {
        return firstName.value + "--" + lastName.value
    },
    set() {

    }
})
console.log(fullName);
</script>

<style></style>